Summary

Replace FlowChat's scrollbar-aligned message anchors and header turn controls with a dedicated left-side turn navigation rail.

The new rail:

• Displays every navigable turn as an evenly spaced horizontal marker.
• Uses a scrollable region bounded to 60% of the FlowChat content height.
• Shows the turn number and user message on hover.
• Highlights every turn intersecting the readable viewport with the same emphasis.
• Navigates through the existing static-history and Virtuoso turn-pin transaction.
• Keeps its own scrolling independent from the FlowChat viewport.

Type and Areas

Type:

• Feature
• UI/UX
• Refactor
• Test
• Docs

Areas:

• Web UI
• FlowChat

Motivation / Impact

The previous implementation coupled turn navigation to the right-side scrollbar and duplicated navigation controls in FlowChatHeader.

This change moves arbitrary turn navigation into a dedicated visual rail, removes the old ScrollAnchor implementation, and removes the header turn list and previous/next buttons.

For users, turn navigation is now consistently available from the left rail without obscuring or modifying the native scrollbar.

For developers:

• The rail delegates to the existing container-owned turn-pin transaction.
• Rail overflow writes only its own scrollTop.
• Visible turn IDs are collected during the existing DOM geometry pass, without a second scan.
• Visible-turn state is published only when membership or order changes.
• Partial-history sessions retain absolute turn numbering for loaded targets.
• Obsolete Header-specific navigation state, naming, styles, and locale keys were removed.

Verification

• pnpm run type-check:web
• pnpm run i18n:audit
  • Passed with 0 warnings.
• pnpm --dir src/web-ui run lint
  • Passed with 0 errors.
  • One unrelated existing prefer-const warning remains in DispatchJobObserver.ts:689.
• pnpm --dir src/web-ui run test:run src/flow_chat/components/modern/FlowChatHeader.test.tsx src/flow_chat/components/modern/FlowChatTurnRail.test.tsx src/flow_chat/components/modern/ModernFlowChatContainer.history-state.test.tsx src/flow_chat/components/modern/VirtualMessageList.session-boundary.test.tsx
  • 4 test files passed.
  • 89 tests passed.
• git diff --cached --check
• Manual visual iteration covered rail placement, density, visible-state emphasis, and hover behavior.

Reviewer Notes

• FlowChatTurnRail is mounted outside the FlowChat scroller and cannot become an outer viewport writer.
• The first intersecting turn remains the semantic current turn for Header state and rail positioning.
• All turns intersecting the readable viewport receive the same visual emphasis.
• The old ScrollAnchor component, preview logic, scroller listeners, and scrollbar-hover styling were deleted.
• FlowChatHeader still displays the current turn and message, but no longer owns arbitrary turn selection or adjacent-turn controls.
• The rail renders only turns with known IDs; partial-history sessions do not synthesize unreachable targets.

Checklist

• This PR is focused and does not include secrets, temporary prompts, generated scratch files, or unrelated artifacts.
• Relevant verification is recorded above, or skipped checks are explained.
• User-facing strings, docs, and locales are updated where applicable.